<template>
	<view class="container" :style="'min-height:' +pageHei+';'">
		<uni-search-bar cancelText="确定" @cancel="searchItem" v-model="searchText" @confirm="searchItem"
			bgColor="#FFFFFF" :radius="30" placeholder="请输入要搜索的公司名称"></uni-search-bar>
	 
		<view class="use-box u-p-y-20 u-p-x-20" v-for="(item,index) in acList" :key="index"
			style="border-top: 1rpx solid #EEEEEE;">
			<view class="u-flex">
				<image class="use-img" style="width:18%"
					:src="'https://www.ydylmold.cn/images/ydylapp/usrCraftsman/image/'+item.usrCraftsman.headImg"></image >
				<view class="u-flex u-flex-col u-col-top u-row-between u-m-x-20" style="width:80%">
					<text class="use-name">{{item.usrCraftsman.usrName}}</text>
				</view>
				<view class="" v-if="item.auditState=='0'" style="width:100px;">
					<button type="primary" class="btn-yao" @click="action(item.id, item.usrCraftsman.craftsmanId, index)" style="height: 30px;font-size: 14px;">同意</button>
					<button type="primary" class="btn-yao" @click="actionBack(item.usrCraftsman.craftsmanId, index)" style="height: 30px;font-size: 14px;margin-top: 2px;background-color: rgb(215, 140, 122)">拒绝</button>
				</view>
			</view>
		</view>
	 
		<view class="digit">共<text style="color: #0080FF;">{{acList.length}}</text>位</view>
		<my-empty tipText="数据为空" v-if="isEmpty" image="http://cdn.uviewui.com/uview/empty/data.png"></my-empty>
		<u-loadmore :status="status" v-else></u-loadmore>
		<my-auth-modal></my-auth-modal>
	</view>
</template>
<script>
	import {
		teamJoin,
		updateAuditState,
		queryJoinUsrInfo
	} from '@/common/api/auth.js'
	import {
		getToken,
		setToken
	} from '@/utils/token.js'
	import {
		duplicateRemoval
	} from '@/utils/common.js'
	export default {
		data() {
			return {
				pageHei: '100vh',
				currPage: 1,
				searchText: '',
				version: getToken('version'),
				acList: [],
				allpage: 1,
				status: 'loading',
				acIndex: 0,
				isEmpty: false
			}
		},
		onLoad: function() {
			uni.getSystemInfo({
				success: (res) => {
					this.pageHei = res.windowHeight * 2 + 'rpx'
				}
			})
			this.getNewList()
		},
		onReachBottom: function() {
			if (this.status == 'loadmore') {
				this.currPage++
				this.getNewList()
			}
		},
		onNavigationBarButtonTap(e) {
			uni.$u.route({
				url: '/pages/meSub/myInvitation/invitaionBill',
			})
		},
		methods: {
			toUrl(path) {
				uni.$u.route({
					url: path,
				})
			},
			searchItem(e) {
				this.currPage = 1
				this.acList = []
				this.getNewList()
			},
			getNewList() {
				let params = {
					companyNo: getToken('useNum'),
					auditState: 0,
					searchText: this.searchText,
					'page.current': this.currPage
				}
				queryJoinUsrInfo(params).then(res => {
					if (res.data.code == 0) {
						this.setData(res, 'usrName')
					}
				})
			},
			action(id, cid, idx) {
				console.log('cid', cid);
				let params = {
					id: id,
					companyNo: getToken('useNum'),
					auditState: 1,
					craftsmanId: cid
				}
				teamJoin(params).then(res => {
					this.acList.splice(idx, 1) //删除
				})
			},
			actionBack(cid, idx) {
				console.log('cid', cid);
				let params = {
					companyNo: getToken('useNum'),
					auditState: 1,
					craftsmanId: cid
				}
				updateAuditState(params).then(res => {
					this.acList.splice(idx, 1) //删除
				})
			},
			setData(res, filter) {
				this.acList = duplicateRemoval(this.acList, res.data.rows || [], 'craftsmanId')
				this.allpage = res.data && res.data.total;
				this.currPage < this.allpage ? this.status = 'loadmore' : this.status = 'nomore';
				this.isEmpty = this.acList.length == 0 ? true : false
			}
		}
	}
</script>
<style lang="scss">
	.container {
		background-color: #F8F8F8;
		padding-bottom: 120rpx;

		.digit {
			font-size: 28rpx;
			letter-spacing: 4rpx;
			margin-top: 10rpx;
			display: flex;
			justify-content: flex-end;
			padding: 0 20rpx
		}

		.use-box {
			background-color: #FFFFFF;
			border-bottom: 1rpx solid #EEEEEE;

			.use-img {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
			}

			.use-name {
				font-size: 32rpx;
			}

			.use-level {
				font-size: 24rpx;
				color: #666666;
				line-height: 60rpx;
			}
		}

		.btn-box {
			position: fixed;
			background-color: #fff;
			bottom: 0;
			width: 750rpx;
			padding: 15rpx 0;
			display: flex;
			align-items: center;
			justify-content: center;

			.btn-yao {
				// width: 500rpx;
				flex: 1;
				margin: 0 20rpx;
				height: 80rpx;
				line-height: 80rpx;
				background-color: #0080FF;
			}
		}
	}
</style>
